<!DOCTYPE HTML>
<html lang="en-US">
<head>
	<meta charset="UTF-8">
	<title>선으로 삼각형 그리기-상대경로</title>
	<script src="raphael/raphael.js" charset="UTF-8"></script>
	<script>
		function makePaper(el, width, height) {
			// 페이퍼 만들기
			// el = 엘리먼트, width = 가로 사이즈, height = 세로 사이즈
			this.paper = Raphael(el, width, height)
		}

		makePaper.prototype.makePath = function(pathString) {
			/*
			라인 그리기

			M40, 40 L80, 80
			M = 가로 40, 세로 40 이동
			L = 가로 80, 세로 80만 라인을 그린다.
			대문자는 절대 경로, 소문자는 상대경로를 의미한다.
			Z = 패스를 닫는다. 즉, 처음 패스가 시작한 부분과 연결한다.
			*/
			this.paper.path(pathString);
		};

		window.onload = function() {
			var paper = new makePaper(document.getElementsByTagName('body')[0], 400, 400); // el, width, height
			paper.makePath('M80,40 l-40, 40 l80 0 Z'); // move to 80, 40, line to -40, 40, Line to 80, 0, Z
		}
	</script>
	<style>
	svg { border:1px solid gray; }
	</style>
</head>
<body>
</body>
</html>